import React from "react";
import './index.css'
import { Button } from 'antd'
import { getRandomLoaclFoods } from "../../untils/foodsStorage";

const Buttons = () => {
  type eventHandler = (key:number) => (e: React.MouseEvent) => Array<number>
  type eventHandlerVoid = () => (e: React.MouseEvent) => void
  const isBloack:boolean = true

  let isShow = window.localStorage.getItem('foodsListShow')
  const changeShow:eventHandlerVoid= () => (e) =>{
    window.localStorage.setItem('foodsListShow','false')
  }

  const toRandom:eventHandler= (randomLength) => (e) =>{
    console.log(getRandomLoaclFoods(randomLength))
    return getRandomLoaclFoods(randomLength)
  }

  return (
    <div>
      <Button type="primary" block={isBloack} className="margin-tb" onClick={toRandom(5)}>开始随机</Button>
      <Button type="primary" block={isBloack} className="margin-tb">换一批</Button>
      <Button type="primary" block={isBloack} className="margin-tb" onClick={changeShow()}>
        {isShow ?'关闭列表':'打开列表'}
      </Button>
    </div>
  )
}

export default Buttons